<template>
	<view class="all">
		
 <!-- <view class="course-message-container"> -->
 <view class="course-message-container" ><!-- v-if="userType=='学生'"-->
    <view class="course-item" v-for="(course, index) in courses" :key="index">
      <view class="picture">
        <image src="../../static/touxiang.jpg" mode="aspectFill"></image>
      </view>
      <view class="course-details">
        <view class="course-info">
          <text class="label">课程名称：</text>
          <text class="value">{{course.className}}</text>
        </view>
        <view class="course-info">
          <text class="label">授课教师：</text>
          <text class="value">{{course.studentName}}</text>
        </view>	
        <view class="course-info">
          <text class="label">课程状态：</text>
          <text :class="course.status === 1 ? 'status-normal' : 'status-pending'">
            {{ course.status === 1 ? '报名成功' : '报名失败' }}
          </text>
        </view>
      </view>
    </view>
  </view>
  
  
  
<!-- 	<view class="course-message-container"> -->
   <view class="course-message-container" v-if="userType=='老师'">
      <view class="course-item" v-for="(course, index) in courses" :key="index">
        <view class="picture">
          <image :src="course.teacherAvatar" mode="aspectFill"></image>
        </view>
        <view class="course-details">
          <view class="course-info">
            <text class="label">课程名称：</text>
            <text class="value">{{course.courseName}}</text>
          </view>
          <view class="course-info">
            <text class="label">上课学生：</text>
            <text class="value">{{course.studentName}}</text>
          </view>
          <view class="course-info">
            <text class="label">课程评价：</text>
           <text class="value">{{course.comment}}</text>
          </view>
        </view>
      </view>
    </view>
	
	
	</view>
</template>

<script>
import { messageList } from '../../api/message/message';

export default {
  data() {
    return {
      courses: [
      ]
    };
  },
  methods:{
	  
  },
  onLoad(){
	  messageList().then(res=>{
		  console.log(res);
		  this.courses=res.rows
	  })
  }
};
</script>

<style scoped>
/* 保持原有样式不变 */
.course-message-container {
  padding: 20rpx;
}
.course-item {
  border: 1px solid #ccc;
  border-radius: 5rpx;
  padding: 15rpx;
  margin-bottom: 15rpx;
  display: flex;
  align-items: center;
}
.picture {
  width: 100rpx;
  height: 100rpx;
  margin-right: 15rpx;
  border-radius: 50%;
  overflow: hidden;
  background-color: #f5f5f5;
}
.picture image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.course-details {
  flex: 1;
}
.course-info {
  margin-bottom: 10rpx;
}
.label {
  font-weight: bold;
  color: #333;
}
.value {
  color: #666;
}
.status-normal {
  color: #00b42a;
  font-weight: bold;
}
.status-pending {
  color: #f53f3f;
  font-weight: bold;
}
</style>